<template>
  <Modal
    v-model='isShow'
    title='设置用户名'
    @on-ok='confirm'
    :loading='isLoading'
    :closable='false'
    :mask-closable='false'
    @on-cancel='cancel'>
    <Input v-model='name' placeholder='请输入用户名' />
    <template v-slot:footer>
      <div class='flex justify-end'>
        <Button type='primary' @click='confirm'>确认</Button>
      </div>
    </template>
  </Modal>
</template>

<script>

import { Button } from 'view-ui-plus'

export default {
  name: 'addEnvDialog.vue',
  components: { Button },
  data() {
    return {
      isShow: false,
      isFetch: false,
      isLoading: true,
      name: null
    }
  },
  methods: {
    show() {
      this.isShow = true
      this.name = null
    },
    close() {
      this.isShow = false
    },
    async confirm() {
      if (this.name == null || this.name == '') {
        this.$Message.warning('请输入用户名')
        this.isLoading = false
        this.$nextTick(() => {
          this.isLoading = true
        })
        return
      }
      localStorage.setItem('name', this.name)
      this.isShow = false
    },
    cancel() {
      this.isShow = false
    }
  }
}
</script>

<style scoped>

</style>